import React, { Component } from "react";
import pubSub from "pubsub-js";
import "./index.css";
export default class index extends Component {
  state = {
    isFirst: true,
    isLoading: false,
    err: "",
    items: [],
  };
  componentDidMount() {
    const that = this;
    pubSub.subscribe("UPDATE", function (msg, data) {
      console.log(msg, data);
      that.setState(data);
    });
  }
  render() {
    const { items, isFirst, isLoading, err } = this.state;
    return (
      <div className="row">
        {isFirst
          ? "第一次进入，点击获取数据"
          : isLoading
          ? "Loading"
          : err
          ? err
          : items.map((v) => {
              return (
                <div className="card" key={v.id}>
                  <a href={v.html_url} rel="noreferrer" target="_blank">
                    <img
                      src={v.avatar_url}
                      alt="head_pic"
                      style={{ width: "100px" }}
                    />
                  </a>
                  <p className="card-text">{v.login}</p>
                </div>
              );
            })}
      </div>
    );
  }
}
